@shawnsandy/mix
Version:
AtomMix--A toolkit for generating utility classes, components and styles-sheets for your design system, style-guide or website from SASS MAPS
2 lines • 9.03 kB
CSS
@charset "UTF-8";code>textarea::-webkit-scrollbar{width:.7rem;border-radius:4px}code>textarea::-webkit-scrollbar:hover{cursor:pointer}code>textarea::-webkit-scrollbar-track{background-color:rgba(0,0,0,.2);border-radius:1rem}code>textarea::-webkit-scrollbar-thumb{cursor:pointer;background-color:grey;border-radius:1rem}[role*=button][aria-label],[role*=button][type=submit],button[aria-label],button[type=submit]{font-size:1.2rem}body p span:first-of-type{font-family:Roboto Slab,serif}html{font-family:“Segoe UI”,BlinkMacSystemFont,“Oxygen”,“Ubuntu”,“Cantarell”,“Fira Sans”,“Droid Sans”,“Helvetica Neue”,sans-serif;-webkit-font-smoothing:antialiased;height:100%;font-size:85%;background-color:#fff;min-width:375px}@media (min-width:580px){html{font-size:95%}}@media (min-width:1380px){html{font-size:100%}}*{box-sizing:border-box}body{padding:0;background-color:#fff;color:rgba(0,0,0,.8);max-width:1980px;margin:0 auto}@media print{body>:not(main){display:none}}body>footer>article,body>footer>aside,body>footer>div,body>footer>section,body>header>article,body>header>aside,body>header>div,body>header>section,body>main>article,body>main>aside,body>main>div,body>main>section,body>nav>article,body>nav>aside,body>nav>div,body>nav>section,body>section>article,body>section>aside,body>section>div,body>section>section{max-width:90%;margin:0 auto}@media screen and (min-width:1280px){body>footer>article,body>footer>aside,body>footer>div,body>footer>section,body>header>article,body>header>aside,body>header>div,body>header>section,body>main>article,body>main>aside,body>main>div,body>main>section,body>nav>article,body>nav>aside,body>nav>div,body>nav>section,body>section>article,body>section>aside,body>section>div,body>section>section{max-width:1600px;width:80%}}@media screen and (min-width:1980px){body>footer>article,body>footer>aside,body>footer>div,body>footer>section,body>header>article,body>header>aside,body>header>div,body>header>section,body>main>article,body>main>aside,body>main>div,body>main>section,body>nav>article,body>nav>aside,body>nav>div,body>nav>section,body>section>article,body>section>aside,body>section>div,body>section>section{max-width:1920px}}body>nav{padding:0}body>header{background-color:transparent;background-image:none;color:rgba(0,0,0,.8);min-height:55vh}body>footer{min-height:10vh;display:flex;align-items:center;align-content:stretch;margin:2rem 0 0;background-color:rgba(0,0,0,.8);color:#fff}body>footer p{text-align:center}body p span:first-of-type{font-size:1.3rem}body section aside{padding:1rem}body hr{border-top:1px solid snow;margin:3rem 0}[aria-hidden]{display:none}h1,h2,h3,h4,h5{line-height:1.5;color:inherit;margin:0 0 1.05rem;font-weight:500}h1{font-size:5rem;word-break:break-all}h2{font-size:3rem}h3{font-size:2.5rem}h4{font-size:1.777rem}h5{font-size:1.4rem}.text_small,small{font-size:.75rem}p{line-height:1.7}nav[aria-label]{background-color:transparent}nav[aria-label]>div,nav[aria-label]>section,nav[aria-label]>ul{height:100%}@media (min-width:960px){nav[aria-label]>div,nav[aria-label]>section,nav[aria-label]>ul{display:flex;align-items:center;justify-content:space-between}}nav[aria-label]>div h1,nav[aria-label]>section h1,nav[aria-label]>ul h1{display:inline-flex;height:inherit;word-break:normal;margin:0 1rem 0 0;padding:0 1rem 0 0;height:5rem}nav[aria-label]>div h1 *+*,nav[aria-label]>section h1 *+*,nav[aria-label]>ul h1 *+*{margin-left:.5rem}nav[aria-label]>div h1 img,nav[aria-label]>section h1 img,nav[aria-label]>ul h1 img{max-height:70%;width:auto}nav[aria-label]>div h1 span,nav[aria-label]>section h1 span,nav[aria-label]>ul h1 span{font-size:1.5rem;color:rgba(0,0,0,.8)}nav[aria-label]>div [aria-hidden],nav[aria-label]>section [aria-hidden],nav[aria-label]>ul [aria-hidden]{display:inline-flex}@media (min-width:980px){nav[aria-label]>div [aria-hidden],nav[aria-label]>section [aria-hidden],nav[aria-label]>ul [aria-hidden]{display:none}}nav[aria-label] ul{padding:0;list-style:none}nav[aria-label] div{height:100%;display:flex;align-items:center}nav[aria-label] div a{display:inline-flex}nav[aria-label] a,nav[aria-label] li{display:flex;align-items:center;font-size:smaller;padding:.5rem;text-decoration:none}nav[aria-label] a,nav[aria-label] a[aria-label*=branding],nav[aria-label] a[aria-label*=logo],nav[aria-label] li,nav[aria-label] li[aria-label*=branding],nav[aria-label] li[aria-label*=logo]{text-align:center;height:100%}nav[aria-label] a[aria-label*=branding]:focus,nav[aria-label] a[aria-label*=branding]:hover,nav[aria-label] a[aria-label*=logo]:focus,nav[aria-label] a[aria-label*=logo]:hover,nav[aria-label] li[aria-label*=branding]:focus,nav[aria-label] li[aria-label*=branding]:hover,nav[aria-label] li[aria-label*=logo]:focus,nav[aria-label] li[aria-label*=logo]:hover{background-color:transparent}nav[aria-label] a:focus,nav[aria-label] a:hover,nav[aria-label] li:focus,nav[aria-label] li:hover{background-color:rgba(0,0,0,.1);opacity:.95}@media (min-width:980px){nav[aria-label] a,nav[aria-label] li{padding:0 1.5rem}}nav[aria-label] li a{padding:0}@media (min-width:980px){nav[aria-label]:first-of-type{min-height:10vh;height:5rem}}[role*=button],button{border:none;font-family:inherit;cursor:pointer;text-decoration:none;background-color:rgba(0,0,0,.8);color:#fff;border-radius:2px;box-shadow:0 1px 3px rgba(0,0,0,.13);transition:background-color .95s ease-out;font-size:smaller;padding:.8rem 1.6rem;min-height:44px;text-align:center;line-height:1.1}@supports (align-items:center){[role*=button],button{display:inline-flex;align-items:center;justify-content:center;align-self:start}}[role*=button]:active,[role*=button]:hover,button:active,button:hover{background-color:rgba(38,38,38,.8);color:#e6e6e6}[role*=button]:focus,button:focus{outline-style:solid;outline-color:transparent;box-shadow:0 0 0 1px grey}[role*=button][aria-label],[role*=button][type=submit],button[aria-label],button[type=submit]{border-color:transparent;color:#fff}[role*=button] span,button span{display:flex}main{min-height:40vh}main>section{width:100%}main>section article{padding:1rem;width:100%;font-size:1}main>section article>*+*{margin-top:2rem}main>section [role=complementary],main>section article+aside{width:100%;padding:1rem;font-size:.95rem}@media (min-width:1280px){main>section{display:flex;align-items:flex-start}main>section [role=complementary],main>section article+aside{min-width:25%;max-width:25%}}header>[role=banner],header>section{min-height:inherit;min-width:inherit;font-size:larger;display:flex;align-items:center;justify-content:center;flex-direction:column;box-sizing:border-box;text-align:center;padding:3rem 0}header>[role=banner] h1,header>[role=banner] h2,header>[role=banner] h3,header>[role=banner] h4,header>[role=banner] h5,header>section h1,header>section h2,header>section h3,header>section h4,header>section h5{margin-top:0}header>[role=banner] p,header>section p{font-size:1.4rem}header>[role=banner]>div>*+*,header>section>div>*+*{margin-top:1rem}section>[role=list]{padding:3rem 0;box-sizing:border-box;display:flex;flex-wrap:wrap;justify-content:flex-start}section>[role=list] [role=listitem]{flex:1 1 33%;padding:1rem;line-height:1.6}@media (min-width:580px) and (mmax-width:980px){section>[role=list] footer [role=listitem]{max-width:auto;flex:1 1 100%}}code{background-color:rgba(0,0,0,.8);color:silver;width:99%;border-radius:2px;display:flex;min-height:1.5rem;overflow:hidden;overflow-y:auto}code>span{padding:0 .5rem;display:inline-flex;width:auto;font-size:.8rem}code>textarea{width:99%;height:300px;background-color:transparent;color:silver;margin:1rem;font-size:1.2rem;line-height:1.5;font-family:monospace;border-color:transparent;resize:none;outline:none}label[for]{font-size:.9rem;display:block}label[for]:before{content:"\2911"}label[for]+input,label[for]+select,label[for]+textarea{background-color:snow;display:flex;margin:.1rem 0 1rem;padding:.5rem;font-size:.9rem;width:100%}label[for]+input::placeholder,label[for]+select::placeholder,label[for]+textarea::placeholder{font-style:italic;color:#d3d3d3}label[for]+select{-moz-appearance:none;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat,repeat;background-position:right .7em top 50%,0 0;background-size:.65em auto,100%}label[for]+textarea{min-height:150px}dl,ol,ul{margin-left:0;padding-left:1.5rem}dl>*+*,ol>*+*,ul>*+*{margin-top:.7rem}span>ol,span ul{list-style:none;margin-left:0;padding-left:0}
/*# sourceMappingURL=/index.css.map */