.fuschia-flat { background-color: #BB3385 }
.fuschia-flat .secondary-bg { background-color: #4831B8 }
.fuschia-flat .accent-bg { background-color: #56AFD5 }
.fuschia-flat .primary-color { color: #FFFFFF }
.fuschia-flat .secondary-color { color: #F3DCEA }
.fuschia-flat .svg-fill { fill: #FFFFFF }

.fuschia-gradient { background: linear-gradient(#F93268, #4731B9) }
.fuschia-gradient .secondary-bg { background-color: #4831B8 }
.fuschia-gradient .accent-bg { background-color: #56AFD5 }
.fuschia-gradient .primary-color { color: #FFFFFF }
.fuschia-gradient .secondary-color { color: #F3DCEA }
.fuschia-gradient .svg-fill { fill: #FFFFFF }

.fuschia-accent { background-color: #56AFD5 }
.fuschia-accent .secondary-bg { background-color: #4831B8 }
.fuschia-accent .accent-bg { background-color: #BB3385 }
.fuschia-accent .primary-color { color: #FFFFFF }
.fuschia-accent .secondary-color { color: #E4F2F8 }
.fuschia-accent .svg-fill { fill: #FFFFFF }

.fuschia-black { background-color: #4831B8 }
.fuschia-black .secondary-bg { background-color: #BB3385 }
.fuschia-black .accent-bg { background-color: #56AFD5 }
.fuschia-black .primary-color { color: #FFFFFF }
.fuschia-black .secondary-color { color: #E7E4F6 }
.fuschia-black .svg-fill { fill: #FFFFFF }

.fuschia-white { background-color: #FFFFFF }
.fuschia-white .secondary-bg { background-color: #F3DCEA }
.fuschia-white .accent-bg { background-color: #56AFD5 }
.fuschia-white .primary-color { color: #000000 }
.fuschia-white .secondary-color { color: #8F8F8F }
.fuschia-white .svg-fill { fill: #BB3385 }
.black-flat { background-color: #000000 }
.black-flat .secondary-bg { background-color: #27224F }
.black-flat .accent-bg { background-color: #4736CA }
.black-flat .primary-color { color: #FFFFFF }
.black-flat .secondary-color { color: #E0DDF6 }
.black-flat .svg-fill { fill: #FFFFFF }

.black-gradient { background: linear-gradient(#27224F, #000000) }
.black-gradient .secondary-bg { background-color: #27224F }
.black-gradient .accent-bg { background-color: #4736CA }
.black-gradient .primary-color { color: #FFFFFF }
.black-gradient .secondary-color { color: #E0DDF6 }
.black-gradient .svg-fill { fill: #FFFFFF }

.black-accent { background-color: #4736CA }
.black-accent .secondary-bg { background-color: #27224F }
.black-accent .accent-bg { background-color: #000000 }
.black-accent .primary-color { color: #FFFFFF }
.black-accent .secondary-color { color: #E9FEFC }
.black-accent .svg-fill { fill: #FFFFFF }

.black-black { background-color: #27224F }
.black-black .secondary-bg { background-color: #000000 }
.black-black .accent-bg { background-color: #4736CA }
.black-black .primary-color { color: #FFFFFF }
.black-black .secondary-color { color: #F0F0F0 }
.black-black .svg-fill { fill: #FFFFFF }

.black-white { background-color: #FFFFFF }
.black-white .secondary-bg { background-color: #E0DDF6 }
.black-white .accent-bg { background-color: #4736CA }
.black-white .primary-color { color: #000000 }
.black-white .secondary-color { color: #8F8F8F }
.black-white .svg-fill { fill: #4736ca }

.blue-flat { background-color: #0065FF }
.blue-flat .secondary-bg { background-color: #041029 }
.blue-flat .accent-bg { background-color: #00CC47 }
.blue-flat .primary-color { color: #FFFFFF }
.blue-flat .secondary-color { color: #D8E8FF }
.blue-flat .svg-fill { fill: #FFFFFF }

.blue-gradient { background: linear-gradient(#00C3FF, #0065FF) }
.blue-gradient .secondary-bg { background-color: #041029 }
.blue-gradient .accent-bg { background-color: #00CC47 }
.blue-gradient .primary-color { color: #FFFFFF }
.blue-gradient .secondary-color { color: #D8E8FF }
.blue-gradient .svg-fill { fill: #FFFFFF }

.blue-accent { background-color: #00CC47 }
.blue-accent .secondary-bg { background-color: #041029 }
.blue-accent .accent-bg { background-color: #0065FF }
.blue-accent .primary-color { color: #FFFFFF }
.blue-accent .secondary-color { color: #DCF8E6 }
.blue-accent .svg-fill { fill: #FFFFFF }

.blue-black { background-color: #041029 }
.blue-black .secondary-bg { background-color: #0065FF }
.blue-black .accent-bg { background-color: #00CC47 }
.blue-black .primary-color { color: #FFFFFF }
.blue-black .secondary-color { color: #DADBDF }
.blue-black .svg-fill { fill: #FFFFFF }

.blue-white { background-color: #FFFFFF }
.blue-white .secondary-bg { background-color: #D8E8FF }
.blue-white .accent-bg { background-color: #00CC47 }
.blue-white .primary-color { color: #000000 }
.blue-white .secondary-color { color: #8F8F8F }
.blue-white .svg-fill { fill: #0065FF }
.brown-flat { background-color: #5B1200 }
.brown-flat .secondary-bg { background-color: #911C00 }
.brown-flat .accent-bg { background-color: #FE7040 }
.brown-flat .primary-color { color: #FFFFFF }
.brown-flat .secondary-color { color: #E5DAD7 }
.brown-flat .svg-fill { fill: #FFFFFF }

.brown-gradient { background: linear-gradient(#911C00, #5B1200) }
.brown-gradient .secondary-bg { background-color: #911C00 }
.brown-gradient .accent-bg { background-color: #FE7040 }
.brown-gradient .primary-color { color: #FFFFFF }
.brown-gradient .secondary-color { color: #E5DAD7 }
.brown-gradient .svg-fill { fill: #FFFFFF }

.brown-accent { background-color: #FE7040 }
.brown-accent .secondary-bg { background-color: #911C00 }
.brown-accent .accent-bg { background-color: #5B1200 }
.brown-accent .primary-color { color: #FFFFFF }
.brown-accent .secondary-color { color: #FFEAE3 }
.brown-accent .svg-fill { fill: #FFFFFF }

.brown-black { background-color: #911C00 }
.brown-black .secondary-bg { background-color: #5B1200 }
.brown-black .accent-bg { background-color: #FE7040 }
.brown-black .primary-color { color: #FFFFFF }
.brown-black .secondary-color { color: #EEDCD8 }
.brown-black .svg-fill { fill: #FFFFFF }

.brown-white { background-color: #FFFFFF }
.brown-white .secondary-bg { background-color: #E5DAD7 }
.brown-white .accent-bg { background-color: #FE7040 }
.brown-white .primary-color { color: #000000 }
.brown-white .secondary-color { color: #8F8F8F }
.brown-white .svg-fill { fill: #5B1200 }
.green-flat { background-color: #8BD746 }
.green-flat .secondary-bg { background-color: #33A07F }
.green-flat .accent-bg { background-color: #267b70 }
.green-flat .primary-color { color: #FFFFFF }
.green-flat .secondary-color { color: #EBF8DE }
.green-flat .svg-fill { fill: #FFFFFF }

.green-gradient { background: linear-gradient(#33A07F, #8BD746) }
.green-gradient .secondary-bg { background-color: #33A07F }
.green-gradient .accent-bg { background-color: #267b70 }
.green-gradient .primary-color { color: #FFFFFF }
.green-gradient .secondary-color { color: #EBF8DE }
.green-gradient .svg-fill { fill: #FFFFFF }

.green-accent { background-color: #267b70 }
.green-accent .secondary-bg { background-color: #33A07F }
.green-accent .accent-bg { background-color: #8BD746 }
.green-accent .primary-color { color: #FFFFFF }
.green-accent .secondary-color { color: #DBE9E8 }
.green-accent .svg-fill { fill: #FFFFFF }

.green-black { background-color: #33A07F }
.green-black .secondary-bg { background-color: #8BD746 }
.green-black .accent-bg { background-color: #267b70 }
.green-black .primary-color { color: #FFFFFF }
.green-black .secondary-color { color: #DDEFE9 }
.green-black .svg-fill { fill: #FFFFFF }

.green-white { background-color: #FFFFFF }
.green-white .secondary-bg { background-color: #EBF8DE }
.green-white .accent-bg { background-color: #267b70 }
.green-white .primary-color { color: #000000 }
.green-white .secondary-color { color: #8F8F8F }
.green-white .svg-fill { fill: #8BD746 }
.avocado-flat { background-color: #3AAFA2 }
.avocado-flat .secondary-bg { background-color: #1B7068 }
.avocado-flat .accent-bg { background-color: #353740 }
.avocado-flat .primary-color { color: #FFFFFF }
.avocado-flat .secondary-color { color: #E4F4F2 }
.avocado-flat .svg-fill { fill: #FFFFFF }

.avocado-gradient { background: linear-gradient(#1B7068, #3AAFA2) }
.avocado-gradient .secondary-bg { background-color: #1B7068 }
.avocado-gradient .accent-bg { background-color: #353740 }
.avocado-gradient .primary-color { color: #FFFFFF }
.avocado-gradient .secondary-color { color: #E4F4F2 }
.avocado-gradient .svg-fill { fill: #FFFFFF }

.avocado-accent { background-color: #353740 }
.avocado-accent .secondary-bg { background-color: #1B7068 }
.avocado-accent .accent-bg { background-color: #3AAFA2 }
.avocado-accent .primary-color { color: #FFFFFF }
.avocado-accent .secondary-color { color: #E1E1E2 }
.avocado-accent .svg-fill { fill: #FFFFFF }

.avocado-black { background-color: #1B7068 }
.avocado-black .secondary-bg { background-color: #3AAFA2 }
.avocado-black .accent-bg { background-color: #353740 }
.avocado-black .primary-color { color: #FFFFFF }
.avocado-black .secondary-color { color: #DDEAE9 }
.avocado-black .svg-fill { fill: #FFFFFF }

.avocado-white { background-color: #FFFFFF }
.avocado-white .secondary-bg { background-color: #E4F4F2 }
.avocado-white .accent-bg { background-color: #353740 }
.avocado-white .primary-color { color: #000000 }
.avocado-white .secondary-color { color: #8F8F8F }
.avocado-white .svg-fill { fill: #3AAFA2 }
.lightblue-flat { background-color: #01D8FD }
.lightblue-flat .secondary-bg { background-color: #2898FB }
.lightblue-flat .accent-bg { background-color: #297AFB }
.lightblue-flat .primary-color { color: #FFFFFF }
.lightblue-flat .secondary-color { color: #D7F9FF }
.lightblue-flat .svg-fill { fill: #FFFFFF }

.lightblue-gradient { background: linear-gradient(#2898FB, #01D8FD) }
.lightblue-gradient .secondary-bg { background-color: #2898FB }
.lightblue-gradient .accent-bg { background-color: #297AFB }
.lightblue-gradient .primary-color { color: #FFFFFF }
.lightblue-gradient .secondary-color { color: #D7F9FF }
.lightblue-gradient .svg-fill { fill: #FFFFFF }

.lightblue-accent { background-color: #297AFB }
.lightblue-accent .secondary-bg { background-color: #2898FB }
.lightblue-accent .accent-bg { background-color: #01D8FD }
.lightblue-accent .primary-color { color: #FFFFFF }
.lightblue-accent .secondary-color { color: #D3E4FE }
.lightblue-accent .svg-fill { fill: #FFFFFF }

.lightblue-black { background-color: #2898FB }
.lightblue-black .secondary-bg { background-color: #01D8FD }
.lightblue-black .accent-bg { background-color: #297AFB }
.lightblue-black .primary-color { color: #FFFFFF }
.lightblue-black .secondary-color { color: #DBEEFE }
.lightblue-black .svg-fill { fill: #FFFFFF }

.lightblue-white { background-color: #FFFFFF }
.lightblue-white .secondary-bg { background-color: #D7F9FF }
.lightblue-white .accent-bg { background-color: #297AFB }
.lightblue-white .primary-color { color: #000000 }
.lightblue-white .secondary-color { color: #8F8F8F }
.lightblue-white .svg-fill { fill: #01D8FD }
.yellow-flat { background-color: #F5CA0A }
.yellow-flat .secondary-bg { background-color: #F5870A }
.yellow-flat .accent-bg { background-color: #353740 }
.yellow-flat .primary-color { color: #FFFFFF }
.yellow-flat .secondary-color { color: #FEFAE6 }
.yellow-flat .svg-fill { fill: #FFFFFF }

.yellow-gradient { background: linear-gradient(#FFA600, #F5CA0A) }
.yellow-gradient .secondary-bg { background-color: #F5870A }
.yellow-gradient .accent-bg { background-color: #353740 }
.yellow-gradient .primary-color { color: #FFFFFF }
.yellow-gradient .secondary-color { color: #FEFAE6 }
.yellow-gradient .svg-fill { fill: #FFFFFF }

.yellow-accent { background-color: #353740 }
.yellow-accent .secondary-bg { background-color: #F5870A }
.yellow-accent .accent-bg { background-color: #F5CA0A }
.yellow-accent .primary-color { color: #FFFFFF }
.yellow-accent .secondary-color { color: #EAEBEC }
.yellow-accent .svg-fill { fill: #FFFFFF }

.yellow-black { background-color: #F5870A }
.yellow-black .secondary-bg { background-color: #F5CA0A }
.yellow-black .accent-bg { background-color: #353740 }
.yellow-black .primary-color { color: #FFFFFF }
.yellow-black .secondary-color { color: #FEF3E6 }
.yellow-black .svg-fill { fill: #FFFFFF }

.yellow-white { background-color: #FFFFFF }
.yellow-white .secondary-bg { background-color: #FEFAE6 }
.yellow-white .accent-bg { background-color: #353740 }
.yellow-white .primary-color { color: #000000 }
.yellow-white .secondary-color { color: #8F8F8F }
.yellow-white .svg-fill { fill: #F5CA0A }
.olive-flat { background-color: #8FA887 }
.olive-flat .secondary-bg { background-color: #365135 }
.olive-flat .accent-bg { background-color: #423310 }
.olive-flat .primary-color { color: #FFFFFF }
.olive-flat .secondary-color { color: #E8EDE7 }
.olive-flat .svg-fill { fill: #FFFFFF }

.olive-gradient { background: linear-gradient(#365135, #8FA887) }
.olive-gradient .secondary-bg { background-color: #365135 }
.olive-gradient .accent-bg { background-color: #423310 }
.olive-gradient .primary-color { color: #FFFFFF }
.olive-gradient .secondary-color { color: #E8EDE7 }
.olive-gradient .svg-fill { fill: #FFFFFF }

.olive-accent { background-color: #423310 }
.olive-accent .secondary-bg { background-color: #365135 }
.olive-accent .accent-bg { background-color: #8FA887 }
.olive-accent .primary-color { color: #FFFFFF }
.olive-accent .secondary-color { color: #DEDCD6 }
.olive-accent .svg-fill { fill: #FFFFFF }

.olive-black { background-color: #365135 }
.olive-black .secondary-bg { background-color: #8FA887 }
.olive-black .accent-bg { background-color: #423310 }
.olive-black .primary-color { color: #FFFFFF }
.olive-black .secondary-color { color: #DCE1DC }
.olive-black .svg-fill { fill: #FFFFFF }

.olive-white { background-color: #FFFFFF }
.olive-white .secondary-bg { background-color: #E8EDE7 }
.olive-white .accent-bg { background-color: #423310 }
.olive-white .primary-color { color: #000000 }
.olive-white .secondary-color { color: #8F8F8F }
.olive-white .svg-fill { fill: #8FA887 }
.gray-flat { background-color: #C4C8D4 }
.gray-flat .secondary-bg { background-color: #E7E8E9 }
.gray-flat .accent-bg { background-color: #443B55 }
.gray-flat .primary-color { color: #000000 }
.gray-flat .secondary-color { color: #72747B }
.gray-flat .svg-fill { fill: #FFFFFF }

.gray-gradient { background: linear-gradient(#E7E8E9, #C4C8D4) }
.gray-gradient .secondary-bg { background-color: #E7E8E9 }
.gray-gradient .accent-bg { background-color: #443B55 }
.gray-gradient .primary-color { color: #000000 }
.gray-gradient .secondary-color { color: #72747B }
.gray-gradient .svg-fill { fill: #FFFFFF }

.gray-accent { background-color: #443B55 }
.gray-accent .secondary-bg { background-color: #b6bac7 }
.gray-accent .accent-bg { background-color: #C4C8D4 }
.gray-accent .primary-color { color: #FFFFFF }
.gray-accent .secondary-color { color: #E8E7EA }
.gray-accent .svg-fill { fill: #FFFFFF }

.gray-black { background-color: #E7E8E9 }
.gray-black .secondary-bg { background-color: #C4C8D4 }
.gray-black .accent-bg { background-color: #443B55 }
.gray-black .primary-color { color: #000000 }
.gray-black .secondary-color { color: #5b5d5d }
.gray-black .svg-fill { fill: #5b5d5d }

.gray-white { background-color: #ffffff }
.gray-white .secondary-bg { background-color: #F8F9FA }
.gray-white .accent-bg { background-color: #443B55 }
.gray-white .primary-color { color: #000000 }
.gray-white .secondary-color { color: #8F8F8F }
.gray-white .svg-fill { fill: #b6bac7 }
.beige-flat { background-color: #F2DEC5 }
.beige-flat .secondary-bg { background-color: #E0C295 }
.beige-flat .accent-bg { background-color: #666663 }
.beige-flat .primary-color { color: #2d271e }
.beige-flat .secondary-color { color: #756858 }
.beige-flat .svg-fill { fill: #FFFFFF }

.beige-gradient { background: linear-gradient(#E0C295, #F2DEC5) }
.beige-gradient .secondary-bg { background-color: #E0C295 }
.beige-gradient .accent-bg { background-color: #666663 }
.beige-gradient .primary-color { color: #2d271e }
.beige-gradient .secondary-color { color: #756858 }
.beige-gradient .svg-fill { fill: #FFFFFF }

.beige-accent { background-color: #666663 }
.beige-accent .secondary-bg { background-color: #E0C295 }
.beige-accent .accent-bg { background-color: #F2DEC5 }
.beige-accent .primary-color { color: #FFFFFF }
.beige-accent .secondary-color { color: #EFEFEF }
.beige-accent .svg-fill { fill: #FFFFFF }

.beige-black { background-color: #E0C295 }
.beige-black .secondary-bg { background-color: #F2DEC5 }
.beige-black .accent-bg { background-color: #666663 }
.beige-black .primary-color { color: #2d271e }
.beige-black .secondary-color { color: #6F604A }
.beige-black .svg-fill { fill: #FFFFFF }

.beige-white { background-color: #FFFFFF }
.beige-white .secondary-bg { background-color: #FBF6EF }
.beige-white .accent-bg { background-color: #666663 }
.beige-white .primary-color { color: #2d271e }
.beige-white .secondary-color { color: #8F8F8F }
.beige-white .svg-fill { fill: #E0C295 }.purple-flat { background-color: #B061D0 }
.purple-flat .secondary-bg { background-color: #252780 }
.purple-flat .accent-bg { background-color: #422DB1 }
.purple-flat .primary-color { color: #FFFFFF }
.purple-flat .secondary-color { color: #F3E6F8 }
.purple-flat .svg-fill { fill: #FFFFFF }

.purple-gradient { background: linear-gradient(#252780, #B061D0) }
.purple-gradient .secondary-bg { background-color: #252780 }
.purple-gradient .accent-bg { background-color: #422DB1 }
.purple-gradient .primary-color { color: #FFFFFF }
.purple-gradient .secondary-color { color: #F3E6F8 }
.purple-gradient .svg-fill { fill: #FFFFFF }

.purple-accent { background-color: #422DB1 }
.purple-accent .secondary-bg { background-color: #252780 }
.purple-accent .accent-bg { background-color: #B061D0 }
.purple-accent .primary-color { color: #FFFFFF }
.purple-accent .secondary-color { color: #ECEAF7 }
.purple-accent .svg-fill { fill: #FFFFFF }

.purple-black { background-color: #252780 }
.purple-black .secondary-bg { background-color: #B061D0 }
.purple-black .accent-bg { background-color: #422DB1 }
.purple-black .primary-color { color: #FFFFFF }
.purple-black .secondary-color { color: #E4E4EF }
.purple-black .svg-fill { fill: #FFFFFF }

.purple-white { background-color: #FFFFFF }
.purple-white .secondary-bg { background-color: #F3E6F8 }
.purple-white .accent-bg { background-color: #422DB1 }
.purple-white .primary-color { color: #000000 }
.purple-white .secondary-color { color: #8F8F8F }
.purple-white .svg-fill { fill: #B061D0 }