@benevolar/b-css
Version:
small css framework
1 lines • 21.3 kB
CSS
@-webkit-keyframes anim-spin{0%{transform:rotate(0)}100%{transform:rotate(359deg)}}@keyframes anim-spin{0%{transform:rotate(0)}100%{transform:rotate(359deg)}}@-webkit-keyframes anim-zoom-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes anim-zoom-in{from{transform:scale(0)}to{transform:scale(1)}}@-webkit-keyframes anim-zoom-out{from{transform:scale(1)}to{transform:scale(0)}}@keyframes anim-zoom-out{from{transform:scale(1)}to{transform:scale(0)}}@-webkit-keyframes anim-fade{0%{opacity:0}50%{opacity:1}100%{opacity:0}}@keyframes anim-fade{0%{opacity:0}50%{opacity:1}100%{opacity:0}}@-webkit-keyframes anim-opac{from{opacity:0}to{opacity:1}}@keyframes anim-opac{from{opacity:0}to{opacity:1}}@-webkit-keyframes anim-shake{0%,100%{transform:translateX(0)}10%{transform:translateX(-9px)}20%{transform:translateX(8px)}30%{transform:translateX(-7px)}40%{transform:translateX(6px)}50%{transform:translateX(-5px)}60%{transform:translateX(4px)}70%{transform:translateX(-3px)}80%{transform:translateX(2px)}90%{transform:translateX(-1px)}}@keyframes anim-shake{0%,100%{transform:translateX(0)}10%{transform:translateX(-9px)}20%{transform:translateX(8px)}30%{transform:translateX(-7px)}40%{transform:translateX(6px)}50%{transform:translateX(-5px)}60%{transform:translateX(4px)}70%{transform:translateX(-3px)}80%{transform:translateX(2px)}90%{transform:translateX(-1px)}}:root{--red:#be0000;--blue:#5aace2;--green:#178344;--yellow:#f3cf3e;--orange:#dd9b60;--purple:#30106d;--pink:pink;--black:#000;--white:#fff;--grey:#ddd;--primary:var(--purple);--secondary:var(--yellow);--light:var(--white);--dark:var(--black);--info:var(--blue);--danger:var(--red);--succes:var(--green);--warning:var(--orange);--color:var(--dark);--caret-color:var(--dark);--hover-color:var(--red);--background-attachment:scroll;--background-blend-mode:normal;--background-clip:border-box;--background-color:var(--light);--background-image:none;--background-origin:padding-box;--background-position:0% 0%;--background-repeat:repeat;--background-size:auto;--sm:0;--md:768px;--lg:1200px;--txt-size-7:0.9rem;--txt-size-6:1.1rem;--txt-size-5:1.3rem;--txt-size-4:1.5rem;--txt-size-3:1.7rem;--txt-size-2:2rem;--txt-size-1:2.3rem;--font-style:normal;--font-variant:normal;--font-weight:normal;--font-size:var(--txt-size-5);--font-family:Verdana,Tahoma,"Times New Roman",sans-serif,serif;--font:var(--font-style) var(--font-variant) var(--font-weight) var(--font-size) var(--font-family);--font-size-adjust:100%;--font-kerning:auto;--font-optical-sizing:auto;--font-stretch:100%;--font-variant-ligatures:normal;--font-variant-caps:normal;--font-variant-numeric:normal;--font-variant-east-asian:normal;--line-height:1.6;--text-decoration-line:none;--text-decoration-style:solid;--text-decoration-color:var(--color);--margin-top:0;--margin-right:0;--margin-bottom:0;--margin-left:0;--margin:var(--margin-top) var(--margin-right) var(--margin-bottom) var(--margin-left);--padding-top:0;--padding-right:0;--padding-bottom:0;--padding-left:0;--padding:var(--padding-top) var(--padding-right) var(--padding-bottom) var(--padding-left);--border-width:0px;--border-style:solid;--border-color:var(--dark);--border-radius:0rem;--border-top-color:var(--dark);--border-top-left-radius:0px;--border-top-right-radius:0px;--border-top-style:none;--border-top-width:0px;--border-bottom-color:rgb(0, 0, 0);--border-bottom-left-radius:0px;--border-bottom-right-radius:0px;--border-bottom-style:none;--border-bottom-width:0px;--border-left-color:rgb(0, 0, 0);--border-left-style:none;--border-left-width:0px;--border-right-color:rgb(0, 0, 0);--border-right-style:none;--border-right-width:0px;--border-image-outset:0px;--border-image-repeat:stretch;--border-image-slice:100%;--border-image-source:none;--border-image-width:1;--border-collapse:separate;--border-spacing:0;--list-style-type:none;--list-style-position:outside;--list-style-image:none;--display:inline-block;--flex-grow:0;--flex-shrink:1;--flex-basis:auto;--flex-direction:row;--flex-wrap:nowrap;--justify-content:center;--align-content:stretch;--align-items:stretch;--grid-column-gap:1rem;--grid-row-gap:1rem;--grid-row-start:auto;--grid-row-end:auto;--grid-column-start:auto;--grid-column-end:auto;--grid-auto-rows:1fr;--grid-auto-columns:1fr;--grid-auto-flow:row;--grid-item-min-width:200px;--grid-item-max-width:1fr;--grid-item-min-height:100px;--grid-item-max-height:2fr;--transition-property:all;--transition-duration:0s;--transition-timing-function:erase;--transition-delay:0s;--animation-delay:0s;--animation-direction:normal;--animation-duration:0s;--animation-fill-mode:none;--animation-iteration-count:1;--animation-name:none;--animation-play-state:running;--animation-timing-function:ease;--column-rule-width:medium;--column-rule-style:none;--column-rule-color:var(--dark);--column-gap:normal;--column-span:none;--column-width:auto;--column-count:auto;--outline-width:medium;--outline-style:invert;--outline-color:var(--dark);--body-max-width:1200px;--body-min-width:320px;--hr-height:1px;--hyphens:auto;--letter-spacing:normal;--word-spacing:normal;--white-space:normal;--box-shadow:0 5px 5px rgba(50, 50, 50, 0.4);--overflow:auto}/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css *//*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{box-sizing:border-box;line-height:1.5;-webkit-text-size-adjust:100%;cursor:default}*,::after,::before{box-sizing:inherit;background-repeat:no-repeat}blockquote,body,dd,dl,dt,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,html,iframe,legend,li,ol,p,pre,textarea,ul{margin:0;padding:0}body{margin:0 auto}main{display:block}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}td:not([align]),th:not([align]){text-align:left}hr{box-sizing:content-box;height:0;overflow:visible}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}canvas,iframe,img,svg,video{display:inline-block;vertical-align:middle;max-width:100%;height:auto;border-style:none}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}button,input,select,textarea{margin:0}ul{list-style:none}a{background-color:transparent}b,strong{font-weight:bolder}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[aria-hidden=true],[hidden]{display:none}[aria-busy=true]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled=true],[disabled]{cursor:not-allowed}[aria-hidden=false][hidden]{display:initial}[aria-hidden=false][hidden]:not(:focus){clip:rect(0,0,0,0);position:absolute}@-ms-viewport{width:device-width}@-o-viewport{width:device-width}@viewport{width:device-width}html{display:var(--display)}*,:after,:before{color:var(--color);background-attachment:var(--background-attachment);background-blend-mode:var(--background-blend-mode);background-clip:var(--background-clip);background-color:var(--background-color);background-image:var(--background-image,none);background-origin:var(--background-origin);background-position:var(--background-position);background-repeat:var(--background-repeat);background-size:var(--background-size);font-style:var(--font-style);font-variant:var(--font-variant);font-weight:var(--font-weight);font-size:var(--font-size);font-family:var(--font-family);font-size-adjust:var(--font-size-adjust);-webkit-text-decoration-line:var(--text-decoration-line);text-decoration-line:var(--text-decoration-line);-webkit-text-decoration-style:var(--text-decoration-style);text-decoration-style:var(--text-decoration-style);-webkit-text-decoration-color:var(--text-decoration-color);text-decoration-color:var(--text-decoration-color);margin:var(--margin);padding:var(--padding);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);border-radius:var(--border-radius);-moz-column-rule-width:var(--column-rule-width);column-rule-width:var(--column-rule-width);-moz-column-rule-style:var(--column-rule-style);column-rule-style:var(--column-rule-style);-moz-column-rule-color:var(--column-rule-color);column-rule-color:var(--column-rule-color);-moz-column-gap:var(--column-gap);column-gap:var(--column-gap);-moz-column-span:var(--column-span);column-span:var(--column-span);-moz-column-width:var(--column-width);column-width:var(--column-width);-moz-column-count:var(--column-count);column-count:var(--column-count);list-style-type:var(--list-style-type);list-style-position:var(--list-style-position);list-style-image:var(--list-style-image);-webkit-hyphens:var(--hyphens);-ms-hyphens:var(--hyphens);hyphens:var(--hyphens);letter-spacing:var(--letter-spacing);word-spacing:var(--word-spacing);white-space:var(--white-space);line-height:var(--line-height);overflow:var(--overflow,auto);vertical-align:baseline}body{min-height:90vh}article,aside,details,div,figcaption,figure,footer,header,main,menu,nav,section,summary{--display:block}canvas,iframe,img,svg,video{--border-style:none;--display:inline-block;width:100%;height:auto}h1{--margin:0}table{--border-spacing-horizontal:1rem;--border-spacing-vertical:1rem;--table-layout:fixed;display:inline-table;border-collapse:collapse;width:100%;border-spacing:var(--border-spacing-horizontal) var(--border-spacing-vertical);table-layout:var(--table-layout)}tr{--odd-bg-color:var(--ligth);--odd-color:var(--dark);--even-bg-color:var(--grey);--even-color:var(--dark);--hover-bg-color:var(--dark);--hover-color:var(--light)}tr:nth-child(even){background-color:var(--even-bg-color);color:var(--even-color)}tr:nth-child(odd){background-color:var(--odd-bg-color);color:var(--odd-color)}tr:hover{background-color:var(--hover-bg-color);color:var(--hover-color)}input{--border-width:2px;--border-color:var(--info);caret-color:var(--caret-color)}input:not(:-moz-placeholder-shown){--border-color:var(--danger)}input:not(:-ms-input-placeholder){--border-color:var(--danger)}input:not(:placeholder-shown){--border-color:var(--danger)}input:valid{--border-color:var(--succes)}:link,:visited,a{--a-background-color:rgb(40, 6, 95);--a-color:rgb(83, 89, 182);--background-color:var(--a-background-color);--color:var(--a-color);text-decoration:none}:link:hover,:visited:hover,a:hover{--background-color:var(--a-color);--color:var(--a-background-color);cursor:pointer;text-decoration:underline}h1,h2,h3,h4,h5,h6{font-weight:400}hr{background-color:var(--black);box-sizing:content-box;height:var(--hr-height);overflow:visible}.float-left{float:left}.float-right{float:right}.float-none{float:none}.inline{display:inline}.block{display:block}.block .inline{display:inline-block}.center{margin:0 auto;top:50%;left:50%;transform:translate(-50%,-50%)}.body{margin:0 auto;max-width:var(--body-max-width);min-width:var(--body-min-width)}@supports (display:flex){.flex{align-items:var(--align-items,center);display:flex;flex:var(--flex-grow) var(--flex-shrink) var(--flex-basis);flex-flow:var(--flex-direction) var(--flex-wrap)}.flex.inline{display:inline-flex}.flex.row{flex-direction:row}.flex.row.reverse{flex-direction:row-reverse}.flex.col{flex-direction:column}.flex.col.reverse{flex-direction:column-reverse}.flex.no-wrap{flex-wrap:nowrap}.flex.wrap{flex-wrap:wrap}.flex.wrap-reverse{flex-wrap:wrap-reverse}}@supports (display:grid){.grid{display:grid;grid-auto-columns:var(--grid-auto-columns);grid-auto-rows:var(--grid-auto-rows);grid-auto-flow:var(--grid-auto-flow);grid-gap:var(--grid-row-gap) var(--grid-column-gap);grid-row:var(--grid-row-start)/var(--grid-row-end);grid-column:var(--grid-column-start)/var(--grid-column-end);justify-content:var(--justify-content)}.grid.inline{display:inline-grid}.grid.row{--grid-auto-flow:column}.grid.row.dense{--grid-auto-flow:column dense}.grid.col{--grid-auto-flow:row}.grid.col.dense{--grid-auto-flow:row dense}.grid.responsive-col{grid-template-columns:repeat(auto-fit,minmax(var(--grid-item-min-width),var(--grid-item-max-width)))}.grid.responsive-row{grid-template-rows:repeat(auto-fit,minmax(var(--grid-item-min-height),var(--grid-item-max-height)))}.grid.no-gap{grid-gap:0}.max-col-1{grid-template-columns:repeat(1,1fr)}.max-row-1{grid-template-rows:repeat(1,1fr)}.col-1{grid-column-end:span 1}.row-1{grid-row-end:span 1}.max-col-2{grid-template-columns:repeat(2,1fr)}.max-row-2{grid-template-rows:repeat(2,1fr)}.col-2{grid-column-end:span 2}.row-2{grid-row-end:span 2}.max-col-3{grid-template-columns:repeat(3,1fr)}.max-row-3{grid-template-rows:repeat(3,1fr)}.col-3{grid-column-end:span 3}.row-3{grid-row-end:span 3}.max-col-4{grid-template-columns:repeat(4,1fr)}.max-row-4{grid-template-rows:repeat(4,1fr)}.col-4{grid-column-end:span 4}.row-4{grid-row-end:span 4}.max-col-5{grid-template-columns:repeat(5,1fr)}.max-row-5{grid-template-rows:repeat(5,1fr)}.col-5{grid-column-end:span 5}.row-5{grid-row-end:span 5}.max-col-6{grid-template-columns:repeat(6,1fr)}.max-row-6{grid-template-rows:repeat(6,1fr)}.col-6{grid-column-end:span 6}.row-6{grid-row-end:span 6}.max-col-7{grid-template-columns:repeat(7,1fr)}.max-row-7{grid-template-rows:repeat(7,1fr)}.col-7{grid-column-end:span 7}.row-7{grid-row-end:span 7}.max-col-8{grid-template-columns:repeat(8,1fr)}.max-row-8{grid-template-rows:repeat(8,1fr)}.col-8{grid-column-end:span 8}.row-8{grid-row-end:span 8}.max-col-9{grid-template-columns:repeat(9,1fr)}.max-row-9{grid-template-rows:repeat(9,1fr)}.col-9{grid-column-end:span 9}.row-9{grid-row-end:span 9}.max-col-10{grid-template-columns:repeat(10,1fr)}.max-row-10{grid-template-rows:repeat(10,1fr)}.col-10{grid-column-end:span 10}.row-10{grid-row-end:span 10}.max-col-11{grid-template-columns:repeat(11,1fr)}.max-row-11{grid-template-rows:repeat(11,1fr)}.col-11{grid-column-end:span 11}.row-11{grid-row-end:span 11}.max-col-12{grid-template-columns:repeat(12,1fr)}.max-row-12{grid-template-rows:repeat(12,1fr)}.col-12{grid-column-end:span 12}.row-12{grid-row-end:span 12}}.jc-start{justify-content:start}.jc-end{justify-content:end}.jc-center{justify-content:center}.jc-stretch{justify-content:stretch}.jc-around{justify-content:space-around}.jc-between{justify-content:space-between}.jc-evenly{justify-content:space-evenly}.ac-start{align-content:flex-start}.ac-end{align-content:flex-end}.ac-center{align-content:center}.ac-stretch{align-content:stretch}.ac-between{align-content:space-between}.ac-around{align-content:space-around}.ai-start{align-items:flex-start}.ai-end{align-items:flex-end}.ai-center{align-items:center}.ai-stretch{align-items:stretch}.ai-baseline{align-items:baseline}.ji-start{justify-items:start}.ji-end{justify-items:end}.ji-center{justify-items:center}.ji-stretch{justify-items:stretch}.btn{--padding-left:10px;--padding-right:10px;--padding-top:10px;--padding-bottom:10px;--border-width:1px;--border-style:solid;--border-color:var(--dark);--border-radius:0.2em;cursor:pointer;display:inline-block;text-align:center;vertical-align:middle;align-items:center;position:relative}.flip{--display-hover:none;--display-no-hover:contents}.flip:hover{--display-hover:contents;--display-no-hover:none}.hide-hover{display:var(--display-no-hover)}.visible-hover{display:var(--display-hover)}.title-section{display:flex}.title-section::after,.title-section::before{margin-right:1rem;margin-left:1rem;content:"";display:block;flex:1 0 0%;border-bottom:1px solid;align-self:center}.burger-icon{--burger-icon-color:black;padding-left:1.25em;position:relative}.burger-icon:before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:1em;background:linear-gradient(to bottom,var(--burger-icon-color),var(--burger-icon-color) 20%,transparent 20%,transparent 40%,var(--burger-icon-color) 40%,var(--burger-icon-color) 60%,transparent 60%,transparent 80%,var(--burger-icon-color) 80%,var(--burger-icon-color) 100%)}.border{--border-top-color:var(--dark);--border-top-left-radius:0px;--border-top-right-radius:0px;--border-top-style:none;--border-top-width:0px;--border-bottom-color:rgb(0, 0, 0);--border-bottom-left-radius:0px;--border-bottom-right-radius:0px;--border-bottom-style:none;--border-bottom-width:0px;--border-left-color:rgb(0, 0, 0);--border-left-style:none;--border-left-width:0px;--border-right-color:rgb(0, 0, 0);--border-right-style:none;--border-right-width:0px;--border-image-outset:0px;--border-image-repeat:stretch;--border-image-slice:100%;--border-image-source:none;--border-image-width:1;--border-collapse:separate;--border-spacing:0;border-top-color:var(--border-top-color);border-top-left-radius:var(--border-top-left-radius);border-top-right-radius:var(--border-top-right-radius);border-top-style:var(--border-top-style);border-top-width:var(--border-top-width);border-bottom-color:var(--border-bottom-color);border-bottom-left-radius:var(--border-bottom-left-radius);border-bottom-right-radius:var(--border-bottom-right-radius);border-bottom-style:var(--border-bottom-style);border-bottom-width:var(--border-bottom-width);border-left-color:var(--border-left-color);border-left-style:var(--border-left-style);border-left-width:var(--border-left-width);border-right-color:var(--border-right-color);border-right-style:var(--border-right-style);border-right-width:var(--border-right-width);border-image-outset:var(--border-image-outset);border-image-repeat:var(--border-image-repeat);border-image-slice:var(--border-image-slice);border-image-source:var(--border-image-source);border-image-width:var(--border-image-width);border-collapse:var(--border-collapse);border-spacing:var(--border-spacing)}.bg-red{--background-color:var(--red)}.bg-blue{--background-color:var(--blue)}.bg-green{--background-color:var(--green)}.bg-yellow{--background-color:var(--yellow)}.bg-orange{--background-color:var(--orange)}.bg-purple{--background-color:var(--purple)}.bg-pink{--background-color:var(--pink)}.bg-black{--background-color:var(--black)}.bg-white{--background-color:var(--white)}.bg-grey{--background-color:var(--grey)}.bg-transparent{--background-color:transparent}.circle{border-radius:50%}.round{border-radius:var(--round-border-radius)}.drop{border-style:medium dashed var(--black)}.cursor-zoom-in{cursor:zoom-in}.cursor-zoom-out{cursor:zoom-out}.cursor-load{cursor:wait}.cursor-clic{cursor:pointer}.cursor-move{cursor:move}.no-cursor{cursor:none}.mt{margin-top:var(--margin-top)}.mb{margin-bottom:var(--margin-bottom)}.ml{margin-left:var(--margin-left)}.mr{margin-right:var(--margin-right)}.pt{padding-top:var(--padding-top)}.pb{padding-bottom:var(--padding-bottom)}.pl{padding-left:var(--padding-left)}.pr{padding-right:var(--padding-right)}.resizable{resize:both;overflow:auto}.no-resizable{resize:none}.full{width:100%;height:100%}.full-width{width:100%}.full-height{height:100%}.auto-height{height:auto}.auto-width{width:auto}.txt-size-1{--font-size:var(--txt-size-1)}.txt-size-2{--font-size:var(--txt-size-2)}.txt-size-3{--font-size:var(--txt-size-3)}.txt-size-4{--font-size:var(--txt-size-4)}.txt-size-5{--font-size:var(--txt-size-5)}.txt-size-6{--font-size:var(--txt-size-6)}.txt-size-7{--font-size:var(--txt-size-7)}.txt-red{--color:var(--red)}.txt-blue{--color:var(--blue)}.txt-green{--color:var(--green)}.txt-yellow{--color:var(--yellow)}.txt-orange{--color:var(--orange)}.txt-purple{--color:var(--purple)}.txt-pink{--color:var(--pink)}.txt-black{--color:var(--black)}.txt-white{--color:var(--white)}.txt-grey{--color:var(--grey)}.txt-italic{font-style:italic}.txt-oblique{font-style:oblique}.txt-bold{font-weight:700}.txt-underline{text-decoration:underline}.txt-line-through{text-decoration:line-through}.txt-error-syntax{-webkit-text-decoration:wavy underline var(--danger);text-decoration:wavy underline var(--danger)}.txt-justify{text-align:justify}.txt-left{text-align:left}.txt-right{text-align:right}.txt-center{text-align:center}.txt-uppercase{text-transform:uppercase}.txt-lowercase{text-transform:lowercase}.txt-capitalize{text-transform:capitalize}.txt-cut-word{-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;overflow-wrap:break-word;word-wrap:break-word}.hidden,[hidden]{display:none}.invisible{visibility:hidden}.clearfix:after{clear:both;content:'';display:table}.no-selectable{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.invert{-webkit-filter:invert(100%);filter:invert(100%)}.negative{color:var(--background-color);background-color:var(--color)}.show-class:before{content:"(" attr(class) ")"}