/* Material-Color.css Copyright (c) 2017 Netsyms Technologies MIT License */ /*****************************************************\ PANELS \*****************************************************/ .panel-red .panel-heading { background-color: #f44336; color: white; } .panel-pink .panel-heading { background-color: #e91e63; color: white; } .panel-purple .panel-heading { background-color: #9c27b0; color: white; } .panel-deep-purple .panel-heading { background-color: #673ab7; color: white; } .panel-indigo .panel-heading { background-color: #3f51b5; color: white; } .panel-blue .panel-heading { background-color: #2196f3; color: white; } .panel-light-blue .panel-heading { background-color: #03a9f4; color: black; } .panel-cyan .panel-heading { background-color: #00bcd4; color: black; } .panel-teal .panel-heading { background-color: #009688; color: white; } .panel-green .panel-heading { background-color: #4caf50; color: black; } .panel-light-green .panel-heading { background-color: #8bc34a; color: black; } .panel-lime .panel-heading { background-color: #cddc39; color: black; } .panel-yellow .panel-heading { background-color: #ffeb3b; color: black; } .panel-amber .panel-heading { background-color: #ffc107; color: black; } .panel-orange .panel-heading { background-color: #ff9800; color: black; } .panel-deep-orange .panel-heading { background-color: #ff5722; color: white; } .panel-brown .panel-heading { background-color: #795548; color: white; } .panel-grey .panel-heading { background-color: #9e9e9e; color: black; } .panel-blue-grey .panel-heading { background-color: #607d8b; color: white; } .panel-red .panel-footer { background-color: #ef9a9a; color: black; } .panel-pink .panel-footer { background-color: #f48fb1; color: black; } .panel-purple .panel-footer { background-color: #ce93d8; color: black; } .panel-deep-purple .panel-footer { background-color: #b39ddb; color: black; } .panel-indigo .panel-footer { background-color: #9fa8da; color: black; } .panel-blue .panel-footer { background-color: #90caf9; color: black; } .panel-light-blue .panel-footer { background-color: #81d4fa; color: black; } .panel-cyan .panel-footer { background-color: #80deea; color: black; } .panel-teal .panel-footer { background-color: #80cbc4; color: black; } .panel-green .panel-footer { background-color: #a5d6a7; color: black; } .panel-light-green .panel-footer { background-color: #c5e1a5; color: black; } .panel-lime .panel-footer { background-color: #e6ee9c; color: black; } .panel-yellow .panel-footer { background-color: #fff59d; color: black; } .panel-amber .panel-footer { background-color: #ffe082; color: black; } .panel-orange .panel-footer { background-color: #ffcc80; color: black; } .panel-deep-orange .panel-footer { background-color: #ffab91; color: black; } .panel-brown .panel-footer { background-color: #bcaaa4; color: black; } .panel-grey .panel-footer { background-color: #eeeeee; color: black; } .panel-blue-grey .panel-footer { background-color: #b0bec5; color: black; } /*****************************************************\ ALERTS \*****************************************************/ .alert-red { background-color: #f44336; color: white; } .alert-pink { background-color: #e91e63; color: white; } .alert-purple { background-color: #9c27b0; color: white; } .alert-deep-purple { background-color: #673ab7; color: white; } .alert-indigo { background-color: #3f51b5; color: white; } .alert-blue { background-color: #2196f3; color: white; } .alert-light-blue { background-color: #03a9f4; color: black; } .alert-cyan { background-color: #00bcd4; color: black; } .alert-teal { background-color: #009688; color: white; } .alert-green { background-color: #4caf50; color: black; } .alert-light-green { background-color: #8bc34a; color: black; } .alert-lime { background-color: #cddc39; color: black; } .alert-yellow { background-color: #ffeb3b; color: black; } .alert-amber { background-color: #ffc107; color: black; } .alert-orange { background-color: #ff9800; color: black; } .alert-deep-orange { background-color: #ff5722; color: white; } .alert-brown { background-color: #795548; color: white; } .alert-grey { background-color: #9e9e9e; color: black; } .alert-blue-grey { background-color: #607d8b; color: white; } /*****************************************************\ NAVBAR \*****************************************************/ .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form { border-color: rgba(0,0,0,.3); } /* red */ .navbar-red { background-color: #f44336; } .navbar-red .navbar-brand { color: white; } .navbar-red .navbar-brand:hover, .navbar-red .navbar-brand:focus { color: white; } .navbar-red .navbar-nav > li > a { color: white; } .navbar-red .navbar-nav > li > a:hover, .navbar-red .navbar-nav > li > a:focus { color: white; } .navbar-red .navbar-nav > .active > a, .navbar-red .navbar-nav > .active > a:hover, .navbar-red .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-red .navbar-nav > .open > a, .navbar-red .navbar-nav > .open > a:hover, .navbar-red .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-red .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-red .navbar-nav > .dropdown > a:hover .caret, .navbar-red .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-red .navbar-nav > .open > a .caret, .navbar-red .navbar-nav > .open > a:hover .caret, .navbar-red .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-red .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-red .navbar-toggle:hover, .navbar-red .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-red .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-red .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-red .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-red .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* pink */ .navbar-pink { background-color: #e91e63; } .navbar-pink .navbar-brand { color: white; } .navbar-pink .navbar-brand:hover, .navbar-pink .navbar-brand:focus { color: white; } .navbar-pink .navbar-nav > li > a { color: white; } .navbar-pink .navbar-nav > li > a:hover, .navbar-pink .navbar-nav > li > a:focus { color: white; } .navbar-pink .navbar-nav > .active > a, .navbar-pink .navbar-nav > .active > a:hover, .navbar-pink .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-pink .navbar-nav > .open > a, .navbar-pink .navbar-nav > .open > a:hover, .navbar-pink .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-pink .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-pink .navbar-nav > .dropdown > a:hover .caret, .navbar-pink .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-pink .navbar-nav > .open > a .caret, .navbar-pink .navbar-nav > .open > a:hover .caret, .navbar-pink .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-pink .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-pink .navbar-toggle:hover, .navbar-pink .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-pink .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-pink .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-pink .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-pink .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* purple */ .navbar-purple { background-color: #9c27b0; } .navbar-purple .navbar-brand { color: white; } .navbar-purple .navbar-brand:hover, .navbar-purple .navbar-brand:focus { color: white; } .navbar-purple .navbar-nav > li > a { color: white; } .navbar-purple .navbar-nav > li > a:hover, .navbar-purple .navbar-nav > li > a:focus { color: white; } .navbar-purple .navbar-nav > .active > a, .navbar-purple .navbar-nav > .active > a:hover, .navbar-purple .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-purple .navbar-nav > .open > a, .navbar-purple .navbar-nav > .open > a:hover, .navbar-purple .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-purple .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-purple .navbar-nav > .dropdown > a:hover .caret, .navbar-purple .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-purple .navbar-nav > .open > a .caret, .navbar-purple .navbar-nav > .open > a:hover .caret, .navbar-purple .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-purple .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-purple .navbar-toggle:hover, .navbar-purple .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-purple .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-purple .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-purple .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-purple .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* deep-purple */ .navbar-deep-purple { background-color: #673ab7; } .navbar-deep-purple .navbar-brand { color: white; } .navbar-deep-purple .navbar-brand:hover, .navbar-deep-purple .navbar-brand:focus { color: white; } .navbar-deep-purple .navbar-nav > li > a { color: white; } .navbar-deep-purple .navbar-nav > li > a:hover, .navbar-deep-purple .navbar-nav > li > a:focus { color: white; } .navbar-deep-purple .navbar-nav > .active > a, .navbar-deep-purple .navbar-nav > .active > a:hover, .navbar-deep-purple .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-deep-purple .navbar-nav > .open > a, .navbar-deep-purple .navbar-nav > .open > a:hover, .navbar-deep-purple .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-deep-purple .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-deep-purple .navbar-nav > .dropdown > a:hover .caret, .navbar-deep-purple .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-deep-purple .navbar-nav > .open > a .caret, .navbar-deep-purple .navbar-nav > .open > a:hover .caret, .navbar-deep-purple .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-deep-purple .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-deep-purple .navbar-toggle:hover, .navbar-deep-purple .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-deep-purple .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-deep-purple .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-deep-purple .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-deep-purple .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* indigo */ .navbar-indigo { background-color: #3f51b5; } .navbar-indigo .navbar-brand { color: white; } .navbar-indigo .navbar-brand:hover, .navbar-indigo .navbar-brand:focus { color: white; } .navbar-indigo .navbar-nav > li > a { color: white; } .navbar-indigo .navbar-nav > li > a:hover, .navbar-indigo .navbar-nav > li > a:focus { color: white; } .navbar-indigo .navbar-nav > .active > a, .navbar-indigo .navbar-nav > .active > a:hover, .navbar-indigo .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-indigo .navbar-nav > .open > a, .navbar-indigo .navbar-nav > .open > a:hover, .navbar-indigo .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-indigo .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-indigo .navbar-nav > .dropdown > a:hover .caret, .navbar-indigo .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-indigo .navbar-nav > .open > a .caret, .navbar-indigo .navbar-nav > .open > a:hover .caret, .navbar-indigo .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-indigo .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-indigo .navbar-toggle:hover, .navbar-indigo .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-indigo .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-indigo .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-indigo .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-indigo .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* blue */ .navbar-blue { background-color: #2196f3; } .navbar-blue .navbar-brand { color: white; } .navbar-blue .navbar-brand:hover, .navbar-blue .navbar-brand:focus { color: white; } .navbar-blue .navbar-nav > li > a { color: white; } .navbar-blue .navbar-nav > li > a:hover, .navbar-blue .navbar-nav > li > a:focus { color: white; } .navbar-blue .navbar-nav > .active > a, .navbar-blue .navbar-nav > .active > a:hover, .navbar-blue .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-blue .navbar-nav > .open > a, .navbar-blue .navbar-nav > .open > a:hover, .navbar-blue .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-blue .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-blue .navbar-nav > .dropdown > a:hover .caret, .navbar-blue .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-blue .navbar-nav > .open > a .caret, .navbar-blue .navbar-nav > .open > a:hover .caret, .navbar-blue .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-blue .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-blue .navbar-toggle:hover, .navbar-blue .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-blue .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-blue .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-blue .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-blue .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* light-blue */ .navbar-light-blue { background-color: #03a9f4; } .navbar-light-blue .navbar-brand { color: black; } .navbar-light-blue .navbar-brand:hover, .navbar-light-blue .navbar-brand:focus { color: black; } .navbar-light-blue .navbar-nav > li > a { color: black; } .navbar-light-blue .navbar-nav > li > a:hover, .navbar-light-blue .navbar-nav > li > a:focus { color: black; } .navbar-light-blue .navbar-nav > .active > a, .navbar-light-blue .navbar-nav > .active > a:hover, .navbar-light-blue .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-light-blue .navbar-nav > .open > a, .navbar-light-blue .navbar-nav > .open > a:hover, .navbar-light-blue .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-light-blue .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-light-blue .navbar-nav > .dropdown > a:hover .caret, .navbar-light-blue .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-light-blue .navbar-nav > .open > a .caret, .navbar-light-blue .navbar-nav > .open > a:hover .caret, .navbar-light-blue .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-light-blue .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-light-blue .navbar-toggle:hover, .navbar-light-blue .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-light-blue .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-light-blue .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-light-blue .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-light-blue .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* cyan */ .navbar-cyan { background-color: #00bcd4; } .navbar-cyan .navbar-brand { color: black; } .navbar-cyan .navbar-brand:hover, .navbar-cyan .navbar-brand:focus { color: black; } .navbar-cyan .navbar-nav > li > a { color: black; } .navbar-cyan .navbar-nav > li > a:hover, .navbar-cyan .navbar-nav > li > a:focus { color: black; } .navbar-cyan .navbar-nav > .active > a, .navbar-cyan .navbar-nav > .active > a:hover, .navbar-cyan .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-cyan .navbar-nav > .open > a, .navbar-cyan .navbar-nav > .open > a:hover, .navbar-cyan .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-cyan .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-cyan .navbar-nav > .dropdown > a:hover .caret, .navbar-cyan .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-cyan .navbar-nav > .open > a .caret, .navbar-cyan .navbar-nav > .open > a:hover .caret, .navbar-cyan .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-cyan .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-cyan .navbar-toggle:hover, .navbar-cyan .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-cyan .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-cyan .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-cyan .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-cyan .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* teal */ .navbar-teal { background-color: #009688; } .navbar-teal .navbar-brand { color: white; } .navbar-teal .navbar-brand:hover, .navbar-teal .navbar-brand:focus { color: white; } .navbar-teal .navbar-nav > li > a { color: white; } .navbar-teal .navbar-nav > li > a:hover, .navbar-teal .navbar-nav > li > a:focus { color: white; } .navbar-teal .navbar-nav > .active > a, .navbar-teal .navbar-nav > .active > a:hover, .navbar-teal .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-teal .navbar-nav > .open > a, .navbar-teal .navbar-nav > .open > a:hover, .navbar-teal .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-teal .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-teal .navbar-nav > .dropdown > a:hover .caret, .navbar-teal .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-teal .navbar-nav > .open > a .caret, .navbar-teal .navbar-nav > .open > a:hover .caret, .navbar-teal .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-teal .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-teal .navbar-toggle:hover, .navbar-teal .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-teal .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-teal .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-teal .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-teal .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* green */ .navbar-green { background-color: #4caf50; } .navbar-green .navbar-brand { color: black; } .navbar-green .navbar-brand:hover, .navbar-green .navbar-brand:focus { color: black; } .navbar-green .navbar-nav > li > a { color: black; } .navbar-green .navbar-nav > li > a:hover, .navbar-green .navbar-nav > li > a:focus { color: black; } .navbar-green .navbar-nav > .active > a, .navbar-green .navbar-nav > .active > a:hover, .navbar-green .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-green .navbar-nav > .open > a, .navbar-green .navbar-nav > .open > a:hover, .navbar-green .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-green .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-green .navbar-nav > .dropdown > a:hover .caret, .navbar-green .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-green .navbar-nav > .open > a .caret, .navbar-green .navbar-nav > .open > a:hover .caret, .navbar-green .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-green .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-green .navbar-toggle:hover, .navbar-green .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-green .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-green .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-green .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-green .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* light-green */ .navbar-light-green { background-color: #8bc34a; } .navbar-light-green .navbar-brand { color: black; } .navbar-light-green .navbar-brand:hover, .navbar-light-green .navbar-brand:focus { color: black; } .navbar-light-green .navbar-nav > li > a { color: black; } .navbar-light-green .navbar-nav > li > a:hover, .navbar-light-green .navbar-nav > li > a:focus { color: black; } .navbar-light-green .navbar-nav > .active > a, .navbar-light-green .navbar-nav > .active > a:hover, .navbar-light-green .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-light-green .navbar-nav > .open > a, .navbar-light-green .navbar-nav > .open > a:hover, .navbar-light-green .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-light-green .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-light-green .navbar-nav > .dropdown > a:hover .caret, .navbar-light-green .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-light-green .navbar-nav > .open > a .caret, .navbar-light-green .navbar-nav > .open > a:hover .caret, .navbar-light-green .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-light-green .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-light-green .navbar-toggle:hover, .navbar-light-green .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-light-green .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-light-green .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-light-green .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-light-green .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* lime */ .navbar-lime { background-color: #cddc39; } .navbar-lime .navbar-brand { color: black; } .navbar-lime .navbar-brand:hover, .navbar-lime .navbar-brand:focus { color: black; } .navbar-lime .navbar-nav > li > a { color: black; } .navbar-lime .navbar-nav > li > a:hover, .navbar-lime .navbar-nav > li > a:focus { color: black; } .navbar-lime .navbar-nav > .active > a, .navbar-lime .navbar-nav > .active > a:hover, .navbar-lime .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-lime .navbar-nav > .open > a, .navbar-lime .navbar-nav > .open > a:hover, .navbar-lime .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-lime .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-lime .navbar-nav > .dropdown > a:hover .caret, .navbar-lime .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-lime .navbar-nav > .open > a .caret, .navbar-lime .navbar-nav > .open > a:hover .caret, .navbar-lime .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-lime .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-lime .navbar-toggle:hover, .navbar-lime .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-lime .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-lime .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-lime .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-lime .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* yellow */ .navbar-yellow { background-color: #ffeb3b; } .navbar-yellow .navbar-brand { color: black; } .navbar-yellow .navbar-brand:hover, .navbar-yellow .navbar-brand:focus { color: black; } .navbar-yellow .navbar-nav > li > a { color: black; } .navbar-yellow .navbar-nav > li > a:hover, .navbar-yellow .navbar-nav > li > a:focus { color: black; } .navbar-yellow .navbar-nav > .active > a, .navbar-yellow .navbar-nav > .active > a:hover, .navbar-yellow .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-yellow .navbar-nav > .open > a, .navbar-yellow .navbar-nav > .open > a:hover, .navbar-yellow .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-yellow .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-yellow .navbar-nav > .dropdown > a:hover .caret, .navbar-yellow .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-yellow .navbar-nav > .open > a .caret, .navbar-yellow .navbar-nav > .open > a:hover .caret, .navbar-yellow .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-yellow .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-yellow .navbar-toggle:hover, .navbar-yellow .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-yellow .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-yellow .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-yellow .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-yellow .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* amber */ .navbar-amber { background-color: #ffc107; } .navbar-amber .navbar-brand { color: black; } .navbar-amber .navbar-brand:hover, .navbar-amber .navbar-brand:focus { color: black; } .navbar-amber .navbar-nav > li > a { color: black; } .navbar-amber .navbar-nav > li > a:hover, .navbar-amber .navbar-nav > li > a:focus { color: black; } .navbar-amber .navbar-nav > .active > a, .navbar-amber .navbar-nav > .active > a:hover, .navbar-amber .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-amber .navbar-nav > .open > a, .navbar-amber .navbar-nav > .open > a:hover, .navbar-amber .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-amber .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-amber .navbar-nav > .dropdown > a:hover .caret, .navbar-amber .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-amber .navbar-nav > .open > a .caret, .navbar-amber .navbar-nav > .open > a:hover .caret, .navbar-amber .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-amber .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-amber .navbar-toggle:hover, .navbar-amber .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-amber .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-amber .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-amber .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-amber .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* orange */ .navbar-orange { background-color: #ff9800; } .navbar-orange .navbar-brand { color: black; } .navbar-orange .navbar-brand:hover, .navbar-orange .navbar-brand:focus { color: black; } .navbar-orange .navbar-nav > li > a { color: black; } .navbar-orange .navbar-nav > li > a:hover, .navbar-orange .navbar-nav > li > a:focus { color: black; } .navbar-orange .navbar-nav > .active > a, .navbar-orange .navbar-nav > .active > a:hover, .navbar-orange .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-orange .navbar-nav > .open > a, .navbar-orange .navbar-nav > .open > a:hover, .navbar-orange .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-orange .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-orange .navbar-nav > .dropdown > a:hover .caret, .navbar-orange .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-orange .navbar-nav > .open > a .caret, .navbar-orange .navbar-nav > .open > a:hover .caret, .navbar-orange .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-orange .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-orange .navbar-toggle:hover, .navbar-orange .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-orange .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-orange .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-orange .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-orange .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* deep-orange */ .navbar-deep-orange { background-color: #ff5722; } .navbar-deep-orange .navbar-brand { color: white; } .navbar-deep-orange .navbar-brand:hover, .navbar-deep-orange .navbar-brand:focus { color: white; } .navbar-deep-orange .navbar-nav > li > a { color: white; } .navbar-deep-orange .navbar-nav > li > a:hover, .navbar-deep-orange .navbar-nav > li > a:focus { color: white; } .navbar-deep-orange .navbar-nav > .active > a, .navbar-deep-orange .navbar-nav > .active > a:hover, .navbar-deep-orange .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-deep-orange .navbar-nav > .open > a, .navbar-deep-orange .navbar-nav > .open > a:hover, .navbar-deep-orange .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-deep-orange .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-deep-orange .navbar-nav > .dropdown > a:hover .caret, .navbar-deep-orange .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-deep-orange .navbar-nav > .open > a .caret, .navbar-deep-orange .navbar-nav > .open > a:hover .caret, .navbar-deep-orange .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-deep-orange .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-deep-orange .navbar-toggle:hover, .navbar-deep-orange .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-deep-orange .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-deep-orange .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-deep-orange .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-deep-orange .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* brown */ .navbar-brown { background-color: #795548; } .navbar-brown .navbar-brand { color: white; } .navbar-brown .navbar-brand:hover, .navbar-brown .navbar-brand:focus { color: white; } .navbar-brown .navbar-nav > li > a { color: white; } .navbar-brown .navbar-nav > li > a:hover, .navbar-brown .navbar-nav > li > a:focus { color: white; } .navbar-brown .navbar-nav > .active > a, .navbar-brown .navbar-nav > .active > a:hover, .navbar-brown .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-brown .navbar-nav > .open > a, .navbar-brown .navbar-nav > .open > a:hover, .navbar-brown .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-brown .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-brown .navbar-nav > .dropdown > a:hover .caret, .navbar-brown .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-brown .navbar-nav > .open > a .caret, .navbar-brown .navbar-nav > .open > a:hover .caret, .navbar-brown .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-brown .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-brown .navbar-toggle:hover, .navbar-brown .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-brown .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-brown .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-brown .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-brown .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /* grey */ .navbar-grey { background-color: #9e9e9e; } .navbar-grey .navbar-brand { color: black; } .navbar-grey .navbar-brand:hover, .navbar-grey .navbar-brand:focus { color: black; } .navbar-grey .navbar-nav > li > a { color: black; } .navbar-grey .navbar-nav > li > a:hover, .navbar-grey .navbar-nav > li > a:focus { color: black; } .navbar-grey .navbar-nav > .active > a, .navbar-grey .navbar-nav > .active > a:hover, .navbar-grey .navbar-nav > .active > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-grey .navbar-nav > .open > a, .navbar-grey .navbar-nav > .open > a:hover, .navbar-grey .navbar-nav > .open > a:focus { color: black; background: rgba(0,0,0,.2); } .navbar-grey .navbar-nav > .dropdown > a .caret { border-top-color: black; border-bottom-color: black; } .navbar-grey .navbar-nav > .dropdown > a:hover .caret, .navbar-grey .navbar-nav > .dropdown > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-grey .navbar-nav > .open > a .caret, .navbar-grey .navbar-nav > .open > a:hover .caret, .navbar-grey .navbar-nav > .open > a:focus .caret { border-top-color: black; border-bottom-color: black; } .navbar-grey .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-grey .navbar-toggle:hover, .navbar-grey .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-grey .navbar-toggle .icon-bar { background-color: black; } @media (max-width: 767px) { .navbar-grey .navbar-nav .open .dropdown-menu > li > a { color: black; } .navbar-grey .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-grey .navbar-nav .open .dropdown-menu > li > a:focus { color: black; } } /* blue-grey */ .navbar-blue-grey { background-color: #607d8b; } .navbar-blue-grey .navbar-brand { color: white; } .navbar-blue-grey .navbar-brand:hover, .navbar-blue-grey .navbar-brand:focus { color: white; } .navbar-blue-grey .navbar-nav > li > a { color: white; } .navbar-blue-grey .navbar-nav > li > a:hover, .navbar-blue-grey .navbar-nav > li > a:focus { color: white; } .navbar-blue-grey .navbar-nav > .active > a, .navbar-blue-grey .navbar-nav > .active > a:hover, .navbar-blue-grey .navbar-nav > .active > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-blue-grey .navbar-nav > .open > a, .navbar-blue-grey .navbar-nav > .open > a:hover, .navbar-blue-grey .navbar-nav > .open > a:focus { color: white; background: rgba(0,0,0,.2); } .navbar-blue-grey .navbar-nav > .dropdown > a .caret { border-top-color: white; border-bottom-color: white; } .navbar-blue-grey .navbar-nav > .dropdown > a:hover .caret, .navbar-blue-grey .navbar-nav > .dropdown > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-blue-grey .navbar-nav > .open > a .caret, .navbar-blue-grey .navbar-nav > .open > a:hover .caret, .navbar-blue-grey .navbar-nav > .open > a:focus .caret { border-top-color: white; border-bottom-color: white; } .navbar-blue-grey .navbar-toggle { border-color: rgba(0,0,0,.2); } .navbar-blue-grey .navbar-toggle:hover, .navbar-blue-grey .navbar-toggle:focus { background: rgba(0,0,0,.2); } .navbar-blue-grey .navbar-toggle .icon-bar { background-color: white; } @media (max-width: 767px) { .navbar-blue-grey .navbar-nav .open .dropdown-menu > li > a { color: white; } .navbar-blue-grey .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-blue-grey .navbar-nav .open .dropdown-menu > li > a:focus { color: white; } } /*****************************************************\ BUTTONS \*****************************************************/ .btn-red, .btn-red:hover, .btn-red:active, .btn-red:focus { background-color: #f44336; color: white; } .btn-pink, .btn-pink:hover, .btn-pink:active, .btn-pink:focus { background-color: #e91e63; color: white; } .btn-purple, .btn-purple:hover, .btn-purple:active, .btn-purple:focus { background-color: #9c27b0; color: white; } .btn-deep-purple, .btn-deep-purple:hover, .btn-deep-purple:active, .btn-deep-purple:focus { background-color: #673ab7; color: white; } .btn-indigo, .btn-indigo:hover, .btn-indigo:active, .btn-indigo:focus { background-color: #3f51b5; color: white; } .btn-blue, .btn-blue:hover, .btn-blue:active, .btn-blue:focus { background-color: #2196f3; color: white; } .btn-light-blue, .btn-light-blue:hover, .btn-light-blue:active, .btn-light-blue:focus { background-color: #03a9f4; color: black; } .btn-cyan, .btn-cyan:hover, .btn-cyan:active, .btn-cyan:focus { background-color: #00bcd4; color: black; } .btn-teal, .btn-teal:hover, .btn-teal:active, .btn-teal:focus { background-color: #009688; color: white; } .btn-green, .btn-green:hover, .btn-green:active, .btn-green:focus { background-color: #4caf50; color: black; } .btn-light-green, .btn-light-green:hover, .btn-light-green:active, .btn-light-green:focus { background-color: #8bc34a; color: black; } .btn-lime, .btn-lime:hover, .btn-lime:active, .btn-lime:focus { background-color: #cddc39; color: black; } .btn-yellow, .btn-yellow:hover, .btn-yellow:active, .btn-yellow:focus { background-color: #ffeb3b; color: black; } .btn-amber, .btn-amber:hover, .btn-amber:active, .btn-amber:focus { background-color: #ffc107; color: black; } .btn-orange, .btn-orange:hover, .btn-orange:active, .btn-orange:focus { background-color: #ff9800; color: black; } .btn-deep-orange, .btn-deep-orange:hover, .btn-deep-orange:active, .btn-deep-orange:focus { background-color: #ff5722; color: white; } .btn-brown, .btn-brown:hover, .btn-brown:active, .btn-brown:focus { background-color: #795548; color: white; } .btn-grey, .btn-grey:hover, .btn-grey:active, .btn-grey:focus { background-color: #9e9e9e; color: black; } .btn-blue-grey, .btn-blue-grey:hover, .btn-blue-grey:active, .btn-blue-grey:focus { background-color: #607d8b; color: white; } /*****************************************************\ TEXT \*****************************************************/ .text-red { color: #f44336; } .text-pink { color: #e91e63; } .text-purple { color: #9c27b0; } .text-deep-purple { color: #673ab7; } .text-indigo { color: #3f51b5; } .text-blue { color: #2196f3; } .text-light-blue { color: #03a9f4; } .text-cyan { color: #00bcd4; } .text-teal { color: #009688; } .text-green { color: #4caf50; } .text-light-green { color: #8bc34a; } .text-lime { color: #cddc39; } .text-yellow { color: #ffeb3b; } .text-amber { color: #ffc107; } .text-orange { color: #ff9800; } .text-deep-orange { color: #ff5722; } .text-brown { color: #795548; } .text-grey { color: #9e9e9e; } .text-blue-grey { color: #607d8b; } /*****************************************************\ LABELS \*****************************************************/ .label-red { background-color: #f44336; color: white; } .label-pink { background-color: #e91e63; color: white; } .label-purple { background-color: #9c27b0; color: white; } .label-deep-purple { background-color: #673ab7; color: white; } .label-indigo { background-color: #3f51b5; color: white; } .label-blue { background-color: #2196f3; color: white; } .label-light-blue { background-color: #03a9f4; color: black; } .label-cyan { background-color: #00bcd4; color: black; } .label-teal { background-color: #009688; color: white; } .label-green { background-color: #4caf50; color: black; } .label-light-green { background-color: #8bc34a; color: black; } .label-lime { background-color: #cddc39; color: black; } .label-yellow { background-color: #ffeb3b; color: black; } .label-amber { background-color: #ffc107; color: black; } .label-orange { background-color: #ff9800; color: black; } .label-deep-orange { background-color: #ff5722; color: white; } .label-brown { background-color: #795548; color: white; } .label-grey { background-color: #9e9e9e; color: black; } .label-blue-grey { background-color: #607d8b; color: white; } /*****************************************************\ PROGRESS BARS \*****************************************************/ .progress-bar-red { background-color: #f44336; color: white; } .progress-bar-pink { background-color: #e91e63; color: white; } .progress-bar-purple { background-color: #9c27b0; color: white; } .progress-bar-deep-purple { background-color: #673ab7; color: white; } .progress-bar-indigo { background-color: #3f51b5; color: white; } .progress-bar-blue { background-color: #2196f3; color: white; } .progress-bar-light-blue { background-color: #03a9f4; color: black; } .progress-bar-cyan { background-color: #00bcd4; color: black; } .progress-bar-teal { background-color: #009688; color: white; } .progress-bar-green { background-color: #4caf50; color: black; } .progress-bar-light-green { background-color: #8bc34a; color: black; } .progress-bar-lime { background-color: #cddc39; color: black; } .progress-bar-yellow { background-color: #ffeb3b; color: black; } .progress-bar-amber { background-color: #ffc107; color: black; } .progress-bar-orange { background-color: #ff9800; color: black; } .progress-bar-deep-orange { background-color: #ff5722; color: white; } .progress-bar-brown { background-color: #795548; color: white; } .progress-bar-grey { background-color: #9e9e9e; color: black; } .progress-bar-blue-grey { background-color: #607d8b; color: white; }